<script setup lang="ts">
    import { ref, reactive, onMounted } from 'vue'
    import { genFileId, ElMessage } from 'element-plus'
    import { useRouter } from "vue-router";
    import AddProjectOperateBox from '/src/components/AddProjectOperateBox.vue'
    import AddProjectOperateButton from '/src/components/AddProjectOperateButton.vue'
    import SlotsAddProjectOpt from '/src/components/SlotsAddProjectOpt.vue'
    import { ResultCheck } from "/src/api/addProject";
    import JsonEditor from '/src/components/JsonEditor.vue'
    import ProjectName from '/src/components/project/ProjectName.vue'
    import { GetRecord,QueryQcc } from '@/api/common/dueDiligenceOptRecord.js'
    import { ReIdentifyElement } from '@/api/common/dueDiligenceProject.js'

    const router = useRouter();
    const loading = ref(false)
    const loadingText = ref('Lodding...')
    const jsonEditorRef = ref(null)

    const opeateParam = reactive({
        opeateText: '识别查询结果，启动仓库查询',
        opdateButtons: [
            //{name: '抵押物初步尽调', methond: 'choiceCollateral' },
            { name: '重新识别要素', methond: 'reIdentifyElement' },
            { name: '开启仓库查询', methond: 'warehouseQuery' }
        ],
    });

    const data = reactive({
        dueDiligenceOptRecord:{
            disposalResults:{}
        },
        projectCode:'',
        // json编辑器默认展开的层级结构
        jsonexpands: [['0','保证人或担保人'],['0','抵质押物']]
    })

    /**
     * 初始化方法
     */
    onMounted(() => {
        data.projectCode = router.currentRoute.value.query.projectCode
        GetRecord(data.projectCode, 1)
            .then((response) => {
                response.data.content.forEach(element => {
                    element.disposalResults = JSON.parse(element.disposalResults)
                });
                data.dueDiligenceOptRecord = response.data.content[0]
            })
            .catch((error) => {});
    })

    /**
     * 启动仓库查询
     */
    const warehouseQuery = () => {
        loadingText.value = '正在进行仓库查询，请稍等...'
        // 开启loading
        loading.value = true;
        const requestData = {
            projectCode: data.projectCode,
            jsonStr: JSON.stringify(jsonEditorRef.value.getJson())
        };
        
        QueryQcc(requestData)
            .then((res) => {
                if(res.code === 200){
                    ElMessage({
                        message: '查询成功！',
                        type: 'success',
                    })
                    // 关闭loading
                    loading.value = false;
                    router.push('/bi_frontend/addProject/resultQuery?projectCode=' + data.projectCode)
                }else{
                    ElMessage({
						message: res.msg||'查询异常.',
						type: "eror",
					});
                    // 关闭loading
                    loading.value = false;
                }
            }).catch((error) => { 
                // 关闭loading
                loading.value = false;
            });
    }
    /**
     * 重新要素识别
     */
    const reIdentifyElement = () => {
        loadingText.value = '正在重新进行要素识别，请稍等...'
        // 开启loading
        loading.value = true;
        ReIdentifyElement(data.projectCode)
            .then((response) => {
                loading.value = false;
                ElMessage({
                    message: '要素识别成功!',
                    type: 'success',
                })
                response.data.disposalResults = JSON.parse(response.data.disposalResults)
                data.dueDiligenceOptRecord = response.data
            })
            .catch((error) => {
                loading.value = false;
            });
    }

    const gridData = [
    {
        collateral: '深圳南山区高新科技园区科技中二路39号万基医药园厂房、仓库、科研楼',
        recordVideo: '录入',
        viewVideo: '查看',
    },
   
    ]

    const collateralVisible = ref(false);

    /**
     * 重新要素识别
     */
    const choiceCollateral = () => {
        collateralVisible.value = true;
    }

    const collateralOK = () => {
        
    }

    const testFn = ()=> {
        alert(123);
    }
</script>

<template>
     <ProjectName :projectCode="data.projectCode"/>
    <SlotsAddProjectOpt :loading="loading" :loadingText="loadingText">
        <div class="w-100">
            <!-- 操作区文本框 -->
            <JsonEditor 
                ref="jsonEditorRef" 
                :json="data.dueDiligenceOptRecord.disposalResults"
                :expand="data.jsonexpands" 
            />
            <!-- 操作区按钮组 -->
            <AddProjectOperateButton 
                :opdateButtons="opeateParam.opdateButtons" 
                @choiceCollateral="choiceCollateral" 
                @warehouseQuery="warehouseQuery" 
                @reIdentifyElement="reIdentifyElement"
                class="d-flex justify-content-end pt-3 pe-3"
            />
        </div>
    </SlotsAddProjectOpt>
    <el-dialog v-model="collateralVisible" title="选择抵押物地址？">
        <!-- <el-table :data="gridData">
        <el-table-column property="collateral" label="抵押物" width="" />
        <el-table-column property="recordVideo" label="操作" width="60" @click="testFn" />
        <el-table-column property="viewVideo" label="操作" width="60" @click="testFn"/>
        </el-table> -->
        
    </el-dialog>
</template>

<style scoped>
    .jsoneditor-vue{
	    height: 100%;
	}
</style>